<template>
	<view>
		<view class="padding30rpx">
			<u-search :show-action="false" placeholder="请输入关键词" @search="sb" v-model="search"></u-search>
		</view>
		<view class="padding30rpx" v-if="dataList.length>0">
			<view class="term-flex dis" v-for="(item,index) in dataList" :key="index">
				 <image class="term-flex-img" :src="item.imgName"></image>
				 <view style="width: 70%;">
					 <view class="term-flex-tit">
						 {{item.name}}
					 </view>
					 <view class="dis" style="margin-top: 50rpx;">
						 <view class="term-left">学习币：{{item.currency}}</view>
						 <view class="term-right" @tap="look(item)">查看详情</view>
					 </view>
				 </view>
			</view>
		</view>
		<u-divider v-else>没有更多了</u-divider>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				search:'',
				dataList:[],
			}
		},
		methods: {
			sb(){
				uni.request({
					method:'GET',
					url:this.$api + '/app/CurriculumContrller/selectSearchCourse',
					data:{
						names:this.search,
						gid:uni.getStorageSync('pid')
					},
					header:{'token':uni.getStorageSync('token')},
					success: (res) => {
						console.log(res)
						if(res.data.code == 200) {
							this.dataList = res.data.data
						} else {
							
						}
					}
				})
			},
			//课程详情
			look(i){
				console.log('123')
				uni.navigateTo({
					url:'/pages/term/course/course?id='+i.id
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.term-flex{
		display: flex;
		flex-wrap: wrap;
		margin-top: 25rpx;
		.term-flex-img{
			width: 180rpx;
			height: 180rpx;
			margin-right: 15rpx;
			border-radius: 10rpx;
		}
		.term-flex-tit{
			font-size: 30rpx;
			color: #333333;
			
		}
		.term-left{
			background: #D9F6FF;
			font-size: 24rpx;
			line-height: 45rpx;
			border-top-left-radius: 20rpx;
			border-bottom-right-radius: 20rpx;
			padding: 0 10rpx;
			color: #00A29A;
		}
		.term-right{
			border: 1rpx solid #00A29A;
			color: #00A29A;
			font-size: 24rpx;
			padding: 4rpx 15rpx;
		}
	}
</style>
